<template>
<base-breadcrumb :title="titleName">
  <searchData
    :search-data="searchArr"
    @search="search"
  />

  <a-card :bordered="false">
    <!-- <title-name title="设计资料审批列表" /> -->

    <list-table
      ref="table"
      :request="loadData2"
      :columns="columns"
      :statistics-config="{ use: true, statistics, temp }"
      :exportConfig="{ use: true,select: '导出选中',all: '导出全部'}"
    >
      <template slot="prefix" slot-scope="ref">
        <a-button
          v-btnPermission="'ds_005_add_01'"
          type="primary"
          @click="handleAdd"
        >
          新增设计资料
        </a-button>
      </template>
      <span
        slot="serial"
        slot-scope="text, record, index"
      >{{ index + 1 }}</span>
      <!--        <template slot="statusName" slot-scope="text, record">-->
      <!--          <StatusDisplay :status-map="statusMap" :status-code="record.statusCode" />-->
      <!--        </template>-->
      <div  slot="operation" slot-scope="text, record">
        <MoreButton>
        <a v-btnPermission="'ds_005_loo_02'" @click="handleDels(record)">查看</a>
        <a v-if="record.statusCode == '0' || record.statusCode == '3' "
              v-btnPermission="'ds_005_edi_03'"
              @click="handleEdit(record)"
        >编辑</a>
        <a v-if="record.statusCode == '1' || record.statusCode == '2'|| record.statusCode == '3'"
              v-btnPermission="'ds_005_moi_05'"
              @click="handleApproveDetail(record)"
        > 审批信息</a>
        </MoreButton>
      </div>
    </list-table>

    <!-- 审批详情 -->
    <ApprovalDetails
      :title="'审批详情'"
      :business-id="businessId"
      :visible="visibleApprove"
      @cancel="visibleApprove = false"
      @confirm="visibleApprove = false"
    />
  </a-card>
</base-breadcrumb>
</template>

<script>
  import moment from 'moment'
  import { STable, Ellipsis } from '@/components'
  import { getDesignResultList, getDesignTotal, getTypeLabels } from '@/api/project/designResult'
  import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
  import ApprovalDetails from '@/components/approvalDetails'
  import ARow from 'ant-design-vue/es/grid/Row'
  import SelectProject from '@/components/Select/SelectProject'
  import StatusDisplay from '@/components/StatusDisplay'
  import OrgTreeSelect from "@/components/OrgTreeSelect"


  const columns = [
    {
      title: '序号',
      width: '65px',
      scopedSlots: { customRender: 'serial' }
    },
    {
      title: '设计资料名称',
      dataIndex: 'resultName'
    },
    {
      title: '设计资料类型',
      dataIndex: 'resultType'

    },
    {
      title: '项目名称',
      dataIndex: 'projectName'
    },
    {
      title: '分公司',
      dataIndex: 'branch'
    },
    {
      title: '项目设计管理类别',
      dataIndex: 'type'
    },
    {
      title: '设计单位',
      dataIndex: 'designUnit'
    },
    {
      title: '图纸版本号',
      dataIndex: 'versionNum',
    },
    {
      title: '出图时间',
      dataIndex: 'drawTime'
    },
    {
      title: '状态',
      width: '110px',
      dataIndex: 'statusName',
      scopedSlots: { customRender: 'statusName' }
    },
    {
      title: '操作',
      dataIndex: 'actions',
      width: '200px',
      // fixed: 'right',
      S:'CSCECXN*2021',
      scopedSlots: { customRender: 'operation' }
    }
  ]

  export default {
    name: 'a' + Date.now(),
    components: {
      ApprovalDetails,
      Ellipsis,
      StatusDisplay
    },
    data() {
      this.columns = columns
      return {
        businessId: '',
        visibleApprove: false,
        statusMap: {
          '0': {
            label: '待提交审核',
            color: '#ffc00e'
          },
          '1': {
            label: '审核中',
            color: '#1890ff'
          },
          '2': {
            label: '审核不通过',
            color: '#FE5500'
          },
          '3': {
            label: '变更中',
            color: '#00A854'
          },
          '4': {
            label: '已变更',
            color: 'gray'
          },
          '5': {
            label: '变更终止',
            color: 'gray'
          }
        },
        searchArr: [
          // 搜索框
          {
            name: '设计资料名称',
            value: 'resultName',
            type: 'input'
          },
          {
            name: '设计资料类型',
            value: 'resultType',
            type: 'select',
            data: []
          },
          {
            name: '所属单位',
            valueKey: 'searchQuery',
            type: OrgTreeSelect
          },
          // {
          //   name: '项目名称',
          //   valueKey: 'projectName',
          //   type: SelectProject,
          //   keyValue: 'branch'
          // },
          {
            name: '状态',
            value: 'statusCode',
            type: 'select',
            data: [
              { label: '待提交审核', value: '0' },
              { label: '审核中', value: '1' },
              { label: '审核通过', value: '2' },
              { label: '审核不通过', value: '3' }
            ]
          }
        ],
        titleName: '',

        // 查询参数
        queryParam: {},
        statistics: {}, // 统计参数
        temp: () => {
          return (
            <span style="margin-right: 12px">
          设计资料总数：<span className="totalNum">{this.statistics.total || 0} 个</span> |
          待提交审核：<span className="totalNum">{this.statistics.toReviewNum || 0} 个</span> |
          审核中：<span className="totalNum">{this.statistics.underReviewNum || 0} 个</span> |
          审核不通过：<span className="totalNum">{this.statistics.unReviewNum || 0} 个</span> |
          审核通过：<span className="totalNum">{this.statistics.reviewNum || 0} 个</span>
        </span>
          )
        },
        // 加载数据方法 必须为 Promise 对象
        loadData2: parameter => {
          this.getDesignTotal()
          const requestParameters = Object.assign({}, parameter, this.queryParam)
          return getDesignResultList(requestParameters)
        }
      }
    },

    created() {
      this.getTypeLabels()
    },
    methods: {
      handleApproveDetail(record) {
        this.visibleApprove = true
        this.businessId = record.id
      },
      getTypeLabels() {
        getTypeLabels({ type: 21 }).then(res => {
          if (res.code === 200) {
            this.searchArr[1].data = this.getChangeDatatTypes(res.data)
          }
        })
      },
      search(val) {
        this.queryParam = val
        this.$refs.table.refresh(true)
      },
      async getDesignTotal() {
        let res = await getDesignTotal(this.queryParam)
        if (res.code === this.SUCCESS_CODE) {
          this.statistics = res.data
        }
      },
      handleDels(val) {
        this.$router.push({ path: '/project/design-details', query: { id: val.id, isEdit: 1 } })
      },
      handleAdd() {
        this.$router.push({ path: '/project/design-result', query: { isEdit: 0 } })
      },
      handleEdit(val) {
        this.$router.push({ path: '/project/design-result-edit', query: { id: val.id, isEdit: 1 } })
      }
    }
  }
</script>


